@import "colors";
.combo-box(@textColor, @background) {
  -fx-background-color: @background;
  -fx-effect: dropshadow(three-pass-box,@textColor, 6, 0, 0, 0);
  .list-cell {
    -fx-text-fill: @textColor;
  }
  .arrow {
    -fx-background-color: @textColor;
  }
  .combo-box-popup {
    .list-view {
      .list-cell {
        -fx-text-fill: @textColor;
        -fx-background-color: @background;
        &:selected {
          -fx-text-fill: @background;
          -fx-background-color: @textColor;
        }
        &:hover {
          -fx-text-fill: @background;
          -fx-background-color: @textColor;
        }
      }
    }
  }
}

.text-field-without-background(@text) {
  -fx-background-color: @nothing;
  -fx-border-width: 0 0 2 0;
  -fx-border-color: @text;
  -fx-border-style: solid;
}

.text-field-bordered(@text,@bg) {
  -fx-background-color: @bg;
  -fx-effect: dropshadow(three-pass-box,@text, 6, 0, 0, 0);
  -fx-text-fill: @text;
}

.check-box-without-border(@color,@background) {
  .box {
    -fx-background-color: @background;
    -fx-border-color: @nothing;
  }
  &:selected .mark {
    -fx-background-color: @color;
  }
  -fx-effect: dropshadow(three-pass-box,@color, 6, 0, 0, 0);
}

.scrollable-config(@color,@background) {
  -fx-font-size: 12;
  -fx-effect: dropshadow(three-pass-box,@color, 8, 0, 0, 0);
  .thumb {
    -fx-background-color: @color;
    -fx-effect: dropshadow(three-pass-box,@color, 8, 0, 0, 0);
  }
  .track {
    -fx-background-color: @background;
  }
}

.scrollable(@color) {
  -fx-background-color: @nothing;
  -fx-font-size: 10;
  .thumb {
    -fx-background-color: @color;
  }
  .track {
    -fx-background-color: rgba(255,255,255,0.6);
    -fx-border-color: @color;
    -fx-border-radius: 10;
  }
}

.tab-view(@color,@background) {
  -fx-background-color: @nothing;
  -fx-background-radius: 8;
  -fx-tab-min-width: 80;
  .tab-label {
    -fx-text-fill: @color;
    -fx-font-size: 13;
  }
  .tab-header-background {
    -fx-background-color: @background;
  }
  .tab {
    -fx-focus-color:@nothing;
    -fx-background-color: @nothing;
    -fx-border-radius: 0;
    &:selected {
       .tab-label {
        -fx-text-fill:@background;
        -fx-font-size: 13;
      }
      -fx-focus-color: @nothing;
      -fx-background-color: #FFF;
      -fx-effect: innershadow(three-pass-box,@color, 4, 0.2, 2, 3);
    }
  }
}
.context-menu(@fontSize, @color, @background){
  .menu-item {
    -fx-font-size: @fontSize;
    -fx-accent: @color;
  }
  .menu-item:hover *{
    -fx-text-fill:@background;
  }
  .menu-item:focused *{
    -fx-text-fill: @background;
  }
}